<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>西瓜用户首页</title>
<link type="text/css" href="css/user_home_favorite.css" rel="stylesheet" />
<link type="text/css" href="css/common.css" rel="stylesheet" />
<link type="text/css" href="css/reset.css" rel="stylesheet" />
<link type="text/css" href="css/esc.css" rel="stylesheet" />
  <link type="text/css" href="theme-chalk/index.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script><!--必须得放在第一的位置-->
    <script type="text/javascript" src="js/user_home_favorite.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/axios.js"></script>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript" src="js/esc.js"></script>
  <script src="js/element-ui-index.js"></script>
</head>

<body>
<div id="app">
<div class="index">
    <myframe>
  <div class="user_content f_f width_1200_center">
    <div class="content_position">您当前的位置：<a href="javascript:">首页</a><span>&gt;</span><a href="javascript:">用户主页</a></div>
   <!-- <div class="user_content_top f_z15"><a href="#">注册会员</a><span>Register</span></div>-->
    <div class="hr_10"></div>
    <div class="user_content_con over_hidden width_1200_center"><!--over_hidden也是清除浮动的一种-->
      <div class="user_content_con_nav fl">
        <div class="nav_info">
          <h1>个人信息</h1>
          <ul>
            <li><div class=""><a :href="'user_home.html?uid='+user.uid">个人资料</a></div></li>
            <li><a :href="'user_home_info.html?uid='+user.uid">修改个人资料</a></li>
            <li><a href="user_home_address.html">收货地址</a></li>
          </ul>
        </div>
        <div class="nav_goods">
          <h1>商品管理</h1>
          <ul>
            <li><a href="user_home_order.html">我的订单</a></li>
            <li><div class="djbs"><a href="user_home_favorite.html">我的收藏</a></div> </li>
            <li><a href="user_home_cart.html">我的购物车</a></li>
            <li><a href="#">卖车中心</a></li>
          </ul>
        </div>
        <div class="nav_comments_opinion">
          <h1>评论意见</h1>
          <ul>
            <li><div class=""><a href="user_home_comment.html">我的评论</a></div> </li>
            <li><a href="user_home_idea.html">我的意见</a></li>
            <li><a href="user_home_message.html">西瓜消息</a></li>
          </ul>
        </div>
      </div>
      <!--右侧购物车-->
      <div class="user_content_con_c fr">
        <div class="content_goods_favorite f_f width_1000_center">
          <div class="content_goods_favorite_top over_hidden width_1000_center">
            <div class="top_favorite fl"><h1>我的收藏夹</h1></div>
            <div class="top_all fr"><span class="span1">西瓜店-全部收藏</span><span class="span2">{{list.length}}</span></div>
          </div>
          <div class="content_goods_favorite_con width_1000_center clearfix">
            <div class="content_goods_favorite_con_top">
              <div class="con_check fl"><input class="check_all" type="checkbox" id="con_check1"/><span><label for="con_check1">全选</label></span></div>
              <div class="con_goods fl"><h1>商品</h1></div>
              <div class="con_action fr"><h1>操作</h1></div>
              <div class="con_time fr"><h1>生成时间</h1></div>
              <div class="con_priceb fr"><h1>单价（元）</h1></div>
            </div>
            <div class="hr_5"></div>
            <div class="content_goods_message_con_check"><input class="check_revsern"  name="check_revsern" type="checkbox" id="con_check2"/><span><label for="con_check2">反选</label></span><a href="javascript:void(0)">加入购物车</a><a href="javascript:void(0)">批量购买</a><a href="javascript:void(0)">批量删除</a></div>


            <div class="content_goods_favorite_con_con " v-for="c,i in list">
              <div class="con_check1 fl"><input name="items" value="<?=$i?>" class="check_one" type="checkbox" /></div>
              <div class="con_goods1 fl clearfix">
                <div class="pic fl"><img :src="c.carM.image" width="110" height="80"/></div>
                <div class="details fl"><a href="javascript:void(0)">{{c.carM.carName}}<span class="">{{c.carM.date}}上牌</span><em class="shuxian">|</em>行驶{{c.carM.traveled}}万公里</a></div>
              </div>
              <div class="con_action1 fr">
                <div class="delete" @click.prevent="op(i)"><a href="" >删除</a></div>
                <div class="move_coll" @click="Entycart(i)"><a href="javascript:void(0)">加入购物车</a></div>
                <div class="move_buy" @click.prevent="paycars"><a href="">购买</a></div>
              </div>
              <div class="con_time1 fr">{{c.carTime}}</div>
              <div class="con_priceb1 fr">{{c.carM.oldPrice}}万</div>
            </div>
            <div class="hr_10"></div>

          </div>
        </div>        
      </div><!--右侧购物车完-->
    </div><!--左右侧完-->
    <!--以后复制的开始--> 
    <div class="buy_content_li width_1200_center">
      <div class="buy_content_li_top clearfix" >
        <div class="buy_content_li_top_default fl"><a href="#">西瓜推荐</a></div>
        <div class="buy_content_li_top_num fr"><a href="#">共{{cars.length}}辆车</a></div>
      </div>
      <div class="hr_5"></div>
      <div class="buy_content_li_list over_hidden clearfix">

        <div v-for="c in cars">
          <div class="index_content_con_margin_l"><!--只用来向右移动的，这样才不会有一个因为父级宽度不够出现在下方-->
            <div class="index_content_con_c'+i+' index_content_con_c width_h_292_276 over_hidden fl"><!--只用来设置内边距--><!--用来设置外右边距-->
              <div class="index_content_con_cc width_h_292_276">
                <div class="index_content_con_pic width_h_292_186">
                  <a :href="'buy_details.html?carId='+c.carId"><img :src="c.image" width="292" height="186" /></a>
                </div>
                <div class="index_content_con_txt width_h_292_90">
                  <p class="p1">
                    <a title="" href="#">{{c.carName}}</a>
                  </p>
                  <p class="p2">
                    <span class="">{{c.date}}上牌</span><em class="shuxian">|</em>行驶{{c.traveled}}万公里
                  </p>
                  <p class="p3">
                    <span><i class="fc-org priType">{{c.oldPrice}}万</i></span><s>{{c.newPrice}}万</s>
                  </p>
                </div>
              </div>
            </div>
          </div>
        </div>

      </div><!--遍历内容部分完-->
    </div><!--整个遍历内容部分完-->
    <!--以后复制的结束-->   
  </div><!--整个内容部分-->
    </myframe>

</div>
</div>
</head>
<script>

  var u = window.location.search
  var p = u.split("=")[1];
    var v = new Vue({
        el: "#app",
        data: {
          user : [],
          list:[],
          addco:[],
          cars : []
        },


        created(){
            this.getLoginedUser();
            this.queryCar();
        },

        methods:{
          //获取用户信息
          getLoginedUser() {
            axios.get("/esc-user/getLoginedUser").then(res => {
              if (res.data.code) {
                this.user = res.data.data;
                this.query();
              }
            })
          },
          query(){
            axios.get("/esc-order/esc/collection/querySc?uid=" + this.user.uid).then(res=>{
              this.list=res.data;
              var reg = /upload/
              for(var a of  this.list ){
                if (a.carM.image.match(reg)){
                  a.carM.image = "/esc-user" + a.carM.image;
                }
              }
              console.info(this.list)
            })

          },


          deleteCo(i){
            var p = new URLSearchParams();
            p.append("coid", this.list[i].coid)
            axios.post("/esc-order/esc/collection/deleteCo", p).then(res=>{
              this.query();
            })
          },

          Entycart(i){
            var p = new URLSearchParams();
            p.append("uid", this.list[i].uid);
            p.append("carId", this.list[i].carId);
            p.append("oldPrice", this.list[i].carM.oldPrice);
            axios.post("/esc-order/esc/order/jiarugouwuche", p).then(res=>{
              alert(res.data.msg)
              this.queryCar();
            })

          },
          queryCar(){
            axios.get("/esc-order/esc/carMessage/queryCar").then(res=>{
              this.cars = res.data;
              var reg = /upload/
              for(var a of  this.cars ){
                if (a.image.match(reg)){
                  a.image = "/esc-user" + a.image;
                }
              }
            })
          },
          paycars(){
            location.href="pay.html?carId=" + this.list.carM.carId
          },
          op(i) {
            this.$confirm('是否要将该车辆从列表中删除, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
              this.deleteCo(i)
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              });
            });
          },

        }


    })
</script>
</body>
</html>